<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>${title}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="${webPath}/res/layui/css/layui.css">
    <link rel="stylesheet" href="../res/static/css/mian.css">
</head>
<body class="lay-blog" style="display:none;">
<#include "../common/header.ftl">
<div class="container-wrap">
    <div class="container">
        <div class="contar-wrap">
            <h4 class="item-title">
                <p><i class="layui-icon layui-icon-speaker"></i>公告：<span></span></p>
            </h4>
<div>

</div>
        <#--文章存放位置-->
        </div>
        <div class="item-btn" id="laypagedemo">
        </div>
    </div>
</div>
<div class="footer">
    <p>
        <span>&copy; 2018</span>
        <span><a href="http://www.layui.com" target="_blank">layui.com</a></span>
        <span>MIT license</span>
    </p>
    <p><span>人生就是一场修行</span></p>
</div>
<script src="../res/layui/layui.js"></script>
<script src="../res/static/js/basePath.js?v=1"></script>
<script>
    layui.use(['form', 'jquery', 'layer', 'laytpl', 'laypage'], function () {
        var form = layui.form
                , laypage = layui.laypage
                , layer = layui.layer
                , laytpl = layui.laytpl
                , $ = layui.jquery;

        var pagecount = 0 ;

        var ajaxMethd = (function () {
            function init() {
                var parameter = {
                    type: "get",
                    url: webPath + "/api/index",
                    async: false,
                    data: {},
                    success: function (res) {
                        if (res.code == 200 && res.message == "OK") {
                            var data = res.data;
                            domMethd.speakerInit(data.speaker);
                            //domMethd.menuInit(data.navItems);
                            domMethd.ariaceInit(data.ariaceList);


                        } else {
                            layer.msg(res.message)
                        }
                    }
                };
                $.ajax(parameter);
            }
            function speakInit() {
                var parameter = {
                    type: "get",
                    url: webPath + "/api/speark/find",
                    async: false,
                    data: {},
                    success: function (res) {
                        if (res.code == 200 && res.message == "OK") {
                            var data = res.data;
                            domMethd.speakerInit(data);
                        } else {
                            layer.msg(res.message)
                        }
                    }
                };
                $.ajax(parameter);
            }
            function ariaceInit(page,size) {
                var data = null;
                var parameter = {
                    type: "post",
                    url: webPath + "/api/article/list",
                    async: false,
                    data: {"page":page,"size":size},
                    success: function (res) {
                        if (res.code == 200 && res.message == "OK") {
                              data = res.data;
                              domMethd.ariaceInit(data);

                        } else {
                            layer.msg(res.message)
                        }
                    }
                };
                $.ajax(parameter);
                return data;
            }



            return {
                init: init
                ,speakInit:speakInit
                ,ariaceInit:ariaceInit
            }
        })();
        var domMethd = (function () {

            function laypager(count){
                //执行一个laypage实例
                laypage.render({
                    elem: 'laypagedemo' //注意，这里的 test1 是 ID，不用加 # 号
                    ,count: count //数据总数，从服务端得到
                    ,limit: 10
                    ,jump: function(obj, first){
                        //do something
                        //首次不执行
                        if(first){
                            return ;
                        }
                        //obj包含了当前分页的所有参数，比如：
                        ajaxMethd.ariaceInit(obj.curr,obj.limit);
                    }
                });
            }
            //公告
            function speakerInit(data) {
                $('body > div.container-wrap > div > div.contar-wrap > h4 > p > span').html(data.title);
            }

            //文章
            function ariaceInit(data) {
                var html = laytpl(LAY_tpl.value).render(data.list);
                $('body > div.container-wrap > div > div.contar-wrap > div').html(html)
            }

            //菜单
            function menuInit(data) {
                var webHtml = "", phoneHtml = "";

                for (var index in data) {
                    var item = data[index];
                    webHtml += '<li class="layui-nav-item"><a href="' + item.url + '">' + item.title + '</a></li>';
                    phoneHtml += '<li><a href="' + item.url + '">' + item.title + '</a></li>';
                }
                $('body > div.header > div > div.blog-nav.pull-right > ul').html(webHtml);//web
                $('#pop-nav').html(phoneHtml)//手机
            }

            //domclean
            function domClean(data) {

            }

            //加载动画
            function domLoad() {
                //加载层-风格4
                var index = layer.msg('加载中', {
                    icon: 16
                    , shade: 0.01
                });
                return index;
            }

            //关闭动画
            function domClose(index) {
                layer.close(index);
            }

            //show HTml
            function showHtml() {
                $('body').attr('style', 'display:block');
                return;
            }

            return {
                speakerInit: speakerInit
                , ariaceInit: ariaceInit
                , menuInit: menuInit
                , showHtml: showHtml
                , domClean: domClean
                , domLoad: domLoad
                , laypager: laypager
            }
        })();
        var index = layer.load(2);
        ajaxMethd.speakInit();
        var data = ajaxMethd.ariaceInit(1,10);
        layer.close(index);
        domMethd.showHtml();
        domMethd.laypager(data.count);

    });
</script>
<script>
    layui.config({
        base: '../res/static/js/'
    }).use('blog');
</script>
</body>
<textarea title="消息模版" id="LAY_tpl" style="display:none;">
{{#  layui.each(d, function(index, item){ }}
 <div class="item">
    <div class="item-box  layer-photos-demo1 layer-photos-demo">
        <h3><a href="${webPath}/page/details?id={{item.id}}">{{ item.name }}</a></h3>
        <h5>发布于：<span>{{ item.updateDate }}</span></h5>
        <p>
         {{ item.desc }}
        </p>
    </div>
    <div class="comment count">
        <a href="details.ftl#comment">评论</a>
        <a href="javascript:;" class="like">点赞</a>
    </div>
</div>
{{#  }); }}
</textarea>
</html>